<template>
	<view>
		<view class="index-content">
			<view class="cu-bar search" :style="{ paddingTop: iStatusBarHeight + 'px'}" style="padding-bottom: 18px;">
				<view class="cu-avatar round" style="background-image:url(../../static/1-1.png);margin-left:0px;background-color: unset;" @click="jumpPage('/pages/index/mypage','n')"></view>
				<view class="search-form radius" style="margin: 0 10px;background:linear-gradient(to right, #145A64, #24436F);placeholder-color: #000;" @click="InputFocus">
					<image src="../../static/3.png" style="width: 46rpx;height: 46rpx;margin:0 7px;"></image>
					<input :adjust-position="false" type="text" placeholder="搜索" confirm-type="search"></input>
				</view>
				<view class="cu-avatar sm" style="background-image:url(../../static/4.png);background-color: unset;"></view>
			</view>
			
				<swiper class="screen-swiper" :class="dotStyle?'square-dot':'round-dot'" :indicator-dots="true" :circular="true" :autoplay="true" interval="5000" duration="500">
					<swiper-item v-for="(item,index) in swiperList" :key="index">
						<image :src="item.url" mode="aspectFill" class="radius"></image>
					</swiper-item>
				</swiper>
					
			<view style="margin-top: 40rpx;">
				<view class="index-top-logo" @click="jump()">
					<view style="margin:0 auto;width: 60rpx;height: 54rpx;">
						<image src="../../static/1-1.png" style="width: 46rpx;height: 46rpx;"></image>
					</view>
					<view>下载APP</view>
				</view>
				<view class="index-top-logo-two">
					<view style="margin:0 auto;width: 60rpx;height: 54rpx;">
						<image src="../../static/1-10.png" style="width: 46rpx;height: 46rpx;"></image>
					</view>
					<view>币圈日历</view>
				</view>
				<view class="index-top-logo">
					<view style="margin:0 auto;width: 60rpx;height: 54rpx;">
						<image src="../../static/1-11.png" style="width: 46rpx;height: 46rpx;"></image>
					</view>
					<view>检测合约</view>
				</view>
				<view class="index-top-logo-two">
					<view style="margin:0 auto;width: 60rpx;height: 54rpx;">
						<image src="../../static/1-1.png" style="width: 46rpx;height: 46rpx;"></image>
					</view>
					<view>btok交流</view>
				</view>
				<view class="index-top-logo">
					<view style="margin:0 auto;width: 60rpx;height: 54rpx;">
						<image src="../../static/1-1.png" style="width: 46rpx;height: 46rpx;"></image>
					</view>
					<view>更多...</view>
				</view>
				<view class="clear"></view>
			</view>

			<view class="index-tz">
				<view style="float: left;">
					<image src="../../static/9.png" style="width: 30rpx;height: 30rpx;"></image>
				</view>
				<view style="float: right">
					<image src="../../static/10.png" style="width: 20rpx;height: 30rpx;"></image>
				</view>
				<view class="clear"></view>
			</view>
			
			<view class="index-box-top">
				7×24新币
			</view>
			<view class="index-box">
				<view class="index-box-header-bg">
					<view class="index-box-header">
						<view style="float: left;width: 40%;">代币</view>
						<view style="float: left;width: 20%;">状态</view>
						<view style="float: left;width: 40%;">发布平台时间</view>
					</view>
				</view>
				<view class="index-box-middle-bg">
					<view class="flex flex-wrap index-box-item" v-for="(item, index) in xinbiList" :key="index" @click="jumpPage('/pages/index/xiangqing','n')" v-if="index < xinCount">
						<view class="basis-xs">
							<view class="flex">
								<view class="flex-sub">
									<image :src="item.image1" style="width: 30px;height: 30px;"></image>
								</view>
								
								<view class="flex-twice">
									<view class="text-white" style="margin: 0 10px 0 5px;width:65px;"><span style="line-height: 15px;display: inline-block;">{{item.name}}</span></view>
								</view>
								
							</view>
						</view>
						
						<view class="flex">
							<view class="text-white" style="line-height: 35px;">
								<image :src="item.image2" style="width: 15px;height: 15px;">
								</image>
							</view>
						</view>
					
						<view class="basis-xs">
							<view class="bg-blue radius text-center" style="width: 30px;height: 20px;font-size: 12px;line-height: 20px;margin-top: 5px;margin-left: 10px;">{{item.status}}</view>
						</view>
						
						<view class="flex justify-end">
							<view class="bg-blue index-box-item-circle">23</view>
							<view class="text-white">:</view>
							<view class="bg-blue index-box-item-circle">23</view>
							<view class="text-white">:</view>
							<view class="bg-blue index-box-item-circle">59</view>
							<view class="text-white">:</view>
							<view class="bg-blue index-box-item-circle">59</view>
						</view>
					</view>

				</view>
				<view class="clear"></view>

				<view class="index-box-bottom-bg">
					<view class="flex solid-bottom padding-bottom-lg justify-center" @click="addXinbiList()"  v-if="!xinbishow">
						<view class="margin-xs text-white text-sm" style="color: #22B472;font-size: 14px;">查看全部</view>
						<view class="margin-xs" style="margin-top: 10px;">
							<text class="cuIcon-unfold" style="color: #22B472;font-weight: bold;font-size:15px;display: block;margin-top:-5px"></text>
							<text class="cuIcon-unfold" style="color: #22B472;font-weight: bold;font-size:15px;display: block;margin-top:-10px"></text>
						</view>
					</view>
					<view class="flex solid-bottom padding-bottom-lg justify-center" @click="subXinbiList()"  v-else>
						<view class="margin-xs text-white text-sm" style="color: #22B472;font-size: 14px;">收回</view>
						<view class="margin-xs" style="margin-top: 10px;">
							<text class="cuIcon-fold" style="color: #22B472;font-weight: bold;font-size:15px;display: block;margin-top:-5px"></text>
							<text class="cuIcon-fold" style="color: #22B472;font-weight: bold;font-size:15px;display: block;margin-top:-10px"></text>
						</view>
					</view>
				</view>
			</view>

			<view class="index-box-top">
				热门预售
			</view>
			<view class="index-box">
				<view class="index-box-header-bg">
					<view class="index-box-header">
						<view style="float: left;width: 40%;">代币</view>
						<view style="float: left;width: 20%;">状态</view>
						<view style="float: left;width: 40%;">预售结束倒计时</view>
					</view>
				</view>
				<view class="index-box-middle-bg">
					<view class="flex flex-wrap index-box-item" v-for="(item, index) in yuShouList" :key="index" v-if="index < xinCount">
						<view class="basis-xs">
							<view class="flex">
								<view class="flex-sub">
									<image :src="item.image1" style="width: 30px;height: 30px;"></image>
								</view>
								
								<view class="flex-twice">
									<view class="text-white" style="margin: 0 10px 0 5px;width:65px;"><span style="line-height: 15px;display: inline-block;">{{item.name}}</span></view>
								</view>
								
							</view>
						</view>
						
						<view class="flex">
							<view class="text-white" style="line-height: 35px;">
								<image :src="item.image2" style="width: 15px;height: 15px;">
								</image>
							</view>
						</view>
					
						<view class="basis-xs">
							<view class="bg-blue radius text-center" style="width: 30px;height: 20px;font-size: 12px;line-height: 20px;margin-top: 5px;margin-left: 10px;">{{item.status}}</view>
						</view>
						
						<view class="flex justify-end">
							<view class="bg-blue index-box-item-circle">23</view>
							<view class="text-white">:</view>
							<view class="bg-blue index-box-item-circle">23</view>
							<view class="text-white">:</view>
							<view class="bg-blue index-box-item-circle">59</view>
							<view class="text-white">:</view>
							<view class="bg-blue index-box-item-circle">59</view>
						</view>
					</view>
				</view>
				<view class="index-box-bottom-bg">
					<view class="flex solid-bottom padding-bottom-lg justify-center" @click="addYuShouList()"  v-if="!yushoushow">
						<view class="margin-xs text-white text-sm" style="color: #22B472;font-size: 14px;">查看全部</view>
						<view class="margin-xs" style="margin-top: 10px;">
							<text class="cuIcon-unfold" style="color: #22B472;font-weight: bold;font-size:15px;display: block;margin-top:-5px"></text>
							<text class="cuIcon-unfold" style="color: #22B472;font-weight: bold;font-size:15px;display: block;margin-top:-10px"></text>
						</view>
					</view>
					<view class="flex solid-bottom padding-bottom-lg justify-center" @click="subYuShouList()"  v-else>
						<view class="margin-xs text-white text-sm" style="color: #22B472;font-size: 14px;">收回</view>
						<view class="margin-xs" style="margin-top: 10px;">
							<text class="cuIcon-fold" style="color: #22B472;font-weight: bold;font-size:15px;display: block;margin-top:-5px"></text>
							<text class="cuIcon-fold" style="color: #22B472;font-weight: bold;font-size:15px;display: block;margin-top:-10px"></text>
						</view>
					</view>
				</view>
			</view>

			<view class="index-box-top">
				热门测评
			</view>
			<view class="index-box">
				<view class="index-box-header-bg">
					<view class="index-box-header">
						<view style="float: left;width: 40%;">代币</view>
						<view style="float: left;width: 12%;">状态</view>
						<view style="float: left;width: 48%;">测评时间</view>
					</view>
				</view>
				<view class="index-box-middle-bg">
					<view class="flex flex-wrap index-box-item" v-for="(item, index) in remenList" :key="index" v-if="index < remenCount">
						<view class="basis-xs">
							<view class="flex">
								<view class="flex-sub">
									<image :src="item.image1" style="width: 30px;height: 30px;"></image>
								</view>
								
								<view class="flex-twice">
									<view class="text-white" style="margin: 0 10px 0 5px;width:65px;"><span style="line-height: 15px;display: inline-block;">{{item.name}}</span></view>
								</view>
								
							</view>
						</view>
						
						<view class="flex">
							<view class="text-white" style="line-height: 35px;">
								<image :src="item.image2" style="width: 15px;height: 15px;">
								</image>
							</view>
						</view>
					
						<view class="basis-xs">
							<view class="bg-blue radius text-center" style="width: 30px;height: 20px;font-size: 12px;line-height: 20px;margin-top: 5px;margin-left: 10px;">{{item.status}}</view>
						</view>
						
						<view class="flex justify-end">
							<view class="bg-blue index-box-item-circle">23</view>
							<view class="text-white">:</view>
							<view class="bg-blue index-box-item-circle">23</view>
							<view class="text-white">:</view>
							<view class="bg-blue index-box-item-circle">59</view>
							<view class="text-white">:</view>
							<view class="bg-blue index-box-item-circle">59</view>
						</view>
					</view>
				</view>
				<view class="index-box-bottom-bg">
					<view class="flex solid-bottom padding-bottom-lg justify-center" @click="addRemenList()"  v-if="!remenshow">
						<view class="margin-xs text-white text-sm" style="color: #22B472;font-size: 14px;">查看全部</view>
						<view class="margin-xs" style="margin-top: 10px;">
							<text class="cuIcon-unfold" style="color: #22B472;font-weight: bold;font-size:15px;display: block;margin-top:-5px"></text>
							<text class="cuIcon-unfold" style="color: #22B472;font-weight: bold;font-size:15px;display: block;margin-top:-10px"></text>
						</view>
					</view>
					<view class="flex solid-bottom padding-bottom-lg justify-center" @click="subRemenList()"  v-else>
						<view class="margin-xs text-white text-sm" style="color: #22B472;font-size: 14px;">收回</view>
						<view class="margin-xs" style="margin-top: 10px;">
							<text class="cuIcon-fold" style="color: #22B472;font-weight: bold;font-size:15px;display: block;margin-top:-5px"></text>
							<text class="cuIcon-fold" style="color: #22B472;font-weight: bold;font-size:15px;display: block;margin-top:-10px"></text>
						</view>
					</view>
				</view>
			</view>

			<!-- <view class="index-box-top">
				广场快讯
			</view>
			<view class="index-box" style="padding: 50rpx 40rpx 20rpx 40rpx;color: #FFF;font-weight: 600;background: url(../../static/13.png);
		background-size: 100% 100%;
		background-repeat: no-repeat;">
				<view>
					<view style="float: left;">
						<view
							style="width: 80rpx;height: 80rpx;background: #000000;border-radius: 70rpx;padding: 10rpx;">
							<image src="../../static/1-1.png" style="width: 60rpx;height: 60rpx;"></image>
						</view>
					</view>
					<view style="float: left;margin-left: 30rpx;">
						<view style="font-size: 32rpx;">
							牛市小组手
							<image src="../../static/2-26.png"
								style="margin-left: 10rpx;margin-right: 10rpx; width: 35rpx;height: 35rpx;margin-bottom: -5rpx;">
							</image>
							<text style="font-size: 28rpx;font-weight: 400;margin-bottom: 10rpx;">(牛市官方)</text>
						</view>
						<view style="font-size: 22rpx;color: #9e9e9e;margin-top: 14rpx;">2023-12-28 23:24:47</view>
					</view>
					<view class="clear"></view>
				</view>
				<view
					style="font-size: 28rpx;font-weight: 400;margin-top: 20rpx;margin-bottom: 20rpx;min-height: 60rpx;">
					牛市APP的吐槽板块是一个让用户分享意见、建议和反馈的地方。无
					论是对产品功能的期待、体验中遇到的问题，还是对改进的建议，或
					者市场乱象的问题。您都可以在这里尽情吐槽。我们珍视每一个声.
				</view>
				<view>
					<view style="float: left;width: 30%;padding-left: 5rpx;">
						<view class="box-button1">推荐</view>
						<text style="font-size: 24rpx;color: grey;">169</text>
					</view>
					<view style="float: left;width: 30%;padding-left: 10rpx;">
						<view class="box-button2">不推荐</view>
						<text style="font-size: 24rpx;color: grey;">0</text>
					</view>
					<view style="float: left;width: 20%;padding-left: 10rpx;">
						<view style="float: left;">
							<image src="../../static/2-27.png" style="width: 40rpx;height: 40rpx;"></image>
						</view>
						<view style="float: left;margin-left: 20rpx; font-size: 24rpx;color: grey;line-height: 40rpx;">
							0
						</view>

					</view>
					<view style="float: left;width: 20%;padding-left: 10rpx;">
						<view style="float: left;">
							<image src="../../static/2-28.png" style="width: 40rpx;height: 40rpx;"></image>
						</view>
						<view style="float: left;margin-left: 20rpx; font-size: 24rpx;color: grey;line-height: 40rpx;">
							推荐
						</view>
					</view>
				</view>
				<view class="clear"></view>
			</view>
			
			<view class="flex solid-bottom padding justify-center" @click="addRemenList()">
				<view class="margin-xs text-white text-sm">查看全部</view>
				<view class="margin-xs" style="margin-top: 6px;">
					<image src="../../static/32.svg" style="width: 30rpx;height: 30rpx;"></image>
				</view>
			</view> -->
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				xinbishow:false,
				xinCount:3,
				yushoushow:false,
				yushowCount:3,
				remenshow:false,
				remenCount:3,
				cardCur: 0,
				swiperList: [{
					id: 0,
					type: 'image',
					url: 'https://ossweb-img.qq.com/images/lol/web201310/skin/big84000.jpg'
				},{
					id: 1,
					type: 'image',
					url: 'https://ossweb-img.qq.com/images/lol/web201310/skin/big37006.jpg',
				}, {
					id: 2,
					type: 'image',
					url: 'https://ossweb-img.qq.com/images/lol/web201310/skin/big39000.jpg'
				}],
				xinbiList: [{
						image1: '../../static/2-12.png',
						image2: '../../static/2-13.png',
						status: '开盘',
						name: 'BLLB',
						time: '1704033261000'
					},
					{
						image1: '../../static/2-14.png',
						image2: '../../static/2-15.png',
						status: '开盘',
						name: 'MK',
						time: '1704119661000'
					}, {
						image1: '../../static/2-16.png',
						image2: '../../static/2-17.png',
						status: '开盘',
						name: 'apt-20',
						time: '1704165381000'
					},{
						image1: '../../static/2-16.png',
						image2: '../../static/2-17.png',
						status: '开盘',
						name: 'apt-20',
						time: '1704165381000'
					},{
						image1: '../../static/2-16.png',
						image2: '../../static/2-17.png',
						status: '开盘',
						name: 'apt-20',
						time: '1704165381000'
					},{
						image1: '../../static/2-16.png',
						image2: '../../static/2-17.png',
						status: '开盘',
						name: 'apt-20',
						time: '1704165381000'
					},
				],
				yuShouList: [{
						image1: '../../static/2-18.png',
						image2: '../../static/2-15.png',
						status: '预售',
						name: 'UMA REUM',
						time: '1704033261000'
					},
					{
						image1: '../../static/2-20.png',
						image2: '../../static/2-22.png',
						status: '预售',
						name: 'ACT',
						time: '1704119661000'
					}, {
						image1: '../../static/2-21.png',
						image2: '../../static/2-15.png',
						status: '预售',
						name: 'HAPPY',
						time: '1704165381000'
					},
				],
				remenList: [{
						image1: '../../static/2-22.png',
						image2: '../../static/2-23.png',
						status: '预售',
						name: 'OMNI',
						time: '1704033261000',
						month: 12,
						day: 23,
						hour: 11,
						min: 20
					},
					{
						image1: '../../static/2-22.png',
						image2: '../../static/2-24.png',
						status: '预售',
						name: 'SILLY',
						time: '1704119661000',
						month: 12,
						day: 23,
						hour: 11,
						min: 20
					}, {
						image1: '../../static/2-25.png',
						image2: '../../static/2-24.png',
						status: '预售',
						name: 'MOBILE',
						time: '1704165381000',
						month: 12,
						day: 23,
						hour: 11,
						min: 20
					},
				],
				dotStyle: false,
				towerStart: 0,
				direction: '',
				iStatusBarHeight:0,
			}
		},
		onLoad() {
			this.iStatusBarHeight = uni.getSystemInfoSync().statusBarHeight;
		},
		onShow() {
			this.getIndexData();
			this.getArticle();
			// #ifdef APP
				this.checkVersionClick();
			// #endif
		},
		methods: {
	async	getArticle() {
				let url = `/getarticlelist`;
				let [err,res] = await this.$http.get(url,{},{
					token:true,
					checkToken:true
				});
				if (!this.$http.errorCheck(err,res)) {
					return uni.hideLoading();
				}
				this.gonggao = res.data.data.gonggao;
			},
	async	getIndexData() {
				let url = `/getindexdata`;
				let [err,res] = await this.$http.post(url,{},{
					token:true,
					checkToken:true
				});
				if (!this.$http.errorCheck(err,res)) {
					return uni.hideLoading();
				}
				
			},
			checkVersionClick(showToast = false) {
				var _self = this;
				// 检测升级
				plus.runtime.getProperty(plus.runtime.appid, function(widgetInfo) {
					_self.$http.post('/update',{
						ver:widgetInfo.version,
					}).then((res) => {
						let [err,result] = res;
						// 错误处理
						//if (!_self.$http.errorCheck(err,result)) return;
						// 成功
						var data = result.data.data;  
						
						if (!data.url){
							// 无需更新
							if (showToast) {
								return uni.showToast({ title: '无需更新',icon:"none" })
							}
							return;
						}
						//我的后台会返回一个安装包地址（pkgUrl），升级包地址（wgtUrl）
						//判空来判断是非是整包升级还是资源包升级
						//content是版本更新内容 \n换行
						//ios用户pkgUrl是苹果市场App地址，android自定义下载地址
						if (data.url != '') {
							uni.navigateTo({
								url:'/pages/uplevel/uplevel'
							})
						}
					});
					
				});
				
			},
			
			InputFocus(){
				uni.navigateTo({
					url:'/pages/index/sousuo'
				})
			},
			// 九宫格跳转
			jumpPage(item, type) {
				if (item) {
					if (type == 's') {
						uni.switchTab({
							url: item
						})
					} else {
						uni.navigateTo({
							url: item
						});
					}
				} else {
					uni.showToast({
						title: "敬请期待",
						icon: "none"
					})
				}
			},
			cardSwiper(e) {
				this.cardCur = e.detail.current
			},
			addXinbiList() {
				this.xinbishow = true;
				this.xinCount = this.xinbiList.length
			},
			subXinbiList(){
				this.xinbishow = false;
				this.xinCount = 3
			},
			addYuShouList() {
				this.yushoushow = true;
				this.yushowCount = this.yuShouList.length
			},
			subYuShouList(){
				console.log(1);
				this.yushoushow = false;
				this.yushowCount = 3
			},
			addRemenList() {
				this.remenshow = true;
				this.remenCount = this.remenList.length
			},
			subRemenList(){
				this.remenshow = false;
				this.remenCount = 3
			},
			getDay(num) {
				var ruccent = new Date()
				var n = num - ruccent.getTime()
				var day = Math.floor(n / 1000 / 3600 / 24)
				return day
			},
			getHour(num) {
				var ruccent = new Date()
				var n = num - ruccent.getTime()
				var hour = Math.floor(n / 1000 / 3600 % 24)
				return hour
			},
			getMinute(num) {
				var ruccent = new Date()
				var n = num - ruccent.getTime()
				var minute = Math.floor(n / 1000 / 60 % 60)
				return minute
			},
			getSeconde(num) {
				var ruccent = new Date()
				var n = num - ruccent.getTime()
				var second = Math.floor(n / 1000 % 60)
				return second
			},

		}
	}
</script>

<style>
	.index-content {
		width: 100%;
		min-height: 100vh;
		background: #191e32;
		padding: 0rpx 40rpx 30rpx 40rpx;
	}

	.index-header {
		width: 100%;
		height: 60rpx;
	}

	.logo-block {
		width: 80rpx;
		height: 80rpx;
		padding-top: 10rpx;
		background: url(../../static/1.png);
		background-size: 100% 100%;
		background-repeat: no-repeat;
	}

	.index-header-search {
		margin-left: 20rpx;
		margin-right: 20rpx;
		width: 476rpx;
		height: 80rpx;
		border-radius: 6rpx;
		padding-top: 15rpx;
		padding-left: 15rpx;
		line-height: 65rpx;
		background: url(../../static/2.png);
		background-size: 100% 100%;
		background-repeat: no-repeat;
	}

	.index-top {
		width: 100%;
		height: 330rpx;
	}

	.uni-margin-wrap {
		width: 690rpx;
		width: 100%;
	}

	.swiper {
		height: 300rpx;
	}

	.swiper-item {
		display: block;
		height: 300rpx;
		line-height: 300rpx;
		text-align: center;
	}

	.swiper-item-bg {
		width: 100%;
		height: 100%;
		border: #00F657;
		background-size: 100% 100%;
		background-repeat: no-repeat;
		padding: 18rpx;
	}

	.swiper-item-button {
		float: left;
		width: 150rpx;
		height: 40rpx;
		line-height: 40rpx;
		background: #28526b;
		border-radius: 4rpx;
		color: #fff;
		font-size: 22rpx;
		margin-left: 20rpx;
		margin-top: 20rpx;
	}

	.uni-bg-red {
		background: red;
	}

	.uni-bg-blue {
		background: blue;
	}

	.uni-bg-green {
		background: green;
	}

	.swiper-list {
		margin-top: 40rpx;
		margin-bottom: 0;
	}

	.uni-common-mt {
		margin-top: 60rpx;
		position: relative;
	}

	.info {
		position: absolute;
		right: 20rpx;
	}

	.uni-padding-wrap {
		width: 550rpx;
		padding: 0 100rpx;
	}

	.index-top-logo {
		float: left;
		width: 20%;
		height: 110rpx;
		background: url(../../static/77.png);
		background-size: 100% 100%;
		background-repeat: no-repeat;
		padding-top: 12rpx;
		text-align: center;
		font-size: 22rpx;
		color: #b9dfe6;
	}
	
	.index-top-logo-two {
		float: left;
		width: 20%;
		height: 110rpx;
		background: url(../../static/7.png);
		background-size: 100% 100%;
		background-repeat: no-repeat;
		padding-top: 12rpx;
		text-align: center;
		font-size: 22rpx;
		color: #b9dfe6;
	}

	.index-tz {
		margin-top: 30rpx;
		height: 70rpx;
		background: url(../../static/8.png);
		background-size: 100% 100%;
		background-repeat: no-repeat;
		padding: 20rpx 20rpx 0 20rpx;
	}

	.index-box-top {
		margin: 0 auto;
		width: 260rpx;
		height: 80rpx;
		line-height: 70rpx;
		background: url(../../static/11.png);
		background-size: 100% 100%;
		background-repeat: no-repeat;
		text-align: center;
		color: #fff;
		font-size: 36rpx;
		font-weight: 600;
		margin-top: 40rpx;
	}

	.index-box {
		margin: 0 auto;
		min-height: 320rpx;
		margin-top: -10rpx;
	}

	.index-box-header-bg {
		width: 100%;
		height: 80rpx;
		background: url(../../static/33.png);
		background-size: 100% 100%;
		background-repeat: no-repeat;
		padding: 14rpx 11rpx 0 23rpx;
	}

	.index-box-middle-bg {
		width: 100%;
		min-height: 80rpx;
		background: url(../../static/35.png);
		background-size: 100% 100%;
		background-repeat: no-repeat;
		padding: 14rpx 11rpx 0 23rpx;
	}

	.index-box-bottom-bg {
		width: 100%;
		min-height: 80rpx;
		background: url(../../static/34.png);
		background-size: 100% 100%;
		background-repeat: no-repeat;
		padding: 14rpx 11rpx 0 23rpx;
	}

	.index-box-header {
		margin: 0 auto;
		width: 100%;
		height: 60rpx;
		line-height: 60rpx;
		background: url(../../static/12.png);
		background-size: 100% 100%;
		background-repeat: no-repeat;
		color: #fff;
		text-align: center;
		font-weight: 600;
	}

	.index-box-item {
		color: #fff;
		font-weight: 600;
		width: 98%;
		margin-top: 10px;
		height: 30px;
		line-height: 30px;
		margin-left: 12px;
	}

	.more-button {
		width: 140rpx;
		margin: 0 auto;
		margin-bottom: 80rpx;
		color: #fff;
		font-size: 22rpx
	}

	.index-box-item-img1 {
		width: 60rpx;
		height: 60rpx;
		margin-bottom: -20rpx;
		margin-right: 10rpx;
	}

	.index-box-item-img2 {
		width: 40rpx;
		height: 40rpx;
		margin-bottom: -10rpx;
		margin-left: 10rpx;
	}

	.index-box-item-button {
		margin: 0 auto;
		width: 60rpx;
		height: 40rpx;
		line-height: 40rpx;
		text-align: center;
		font-size: 22rpx;
		font-weight: 400;
		border-radius: 6rpx;
		background: #00C3FF;
		margin-top: 40rpx;
	}

	.index-box-item-button2 {
		margin: 0 auto;
		width: 60rpx;
		height: 40rpx;
		line-height: 40rpx;
		text-align: center;
		font-size: 28rpx;
		font-weight: 600;
		margin-top: 40rpx;
	}
	
	.card-swiper {
		height: 210px !important;
	}

	/* .index-box-item-circle {
		float: left;
		width: 46rpx;
		height: 46rpx;
		line-height: 46rpx;
		background: url(../../static/20.png);
		background-size: 100% 100%;
		background-repeat: no-repeat;
		text-align: center;
		color: #000;
		margin-top: 36rpx;
		margin-left: 2rpx;
		margin-right: 2rpx;

	} */
	
	.index-box-item-circle{
		background: url(../../static/20.png);
		background-size: 100% 100%;
		background-repeat: no-repeat;color: #000;    width: 23px;
		height: 23px;
		line-height: 23px;
		text-align:center;
		margin-top: 5px;
	}

	.box-button1 {
		display: inline-block;
		width: 90rpx;
		height: 40rpx;
		line-height: 40rpx;
		text-align: center;
		background: #fff;
		border-radius: 4rpx;
		color: #2767ff;
		font-size: 24rpx;
		margin-right: 10rpx;
		margin-bottom: 20rpx;
	}

	.box-button2 {
		display: inline-block;
		width: 90rpx;
		height: 40rpx;
		line-height: 40rpx;
		text-align: center;
		background: #fef4e8;
		border-radius: 4rpx;
		color: #f6a019;
		font-size: 24rpx;
		margin-right: 10rpx;
		margin-bottom: 20rpx;
	}

	.clear {
		clear: both;
	}
</style>
